<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./lib/vue.js"></script>
		<script src="./lib/vue-router.js"></script>
	</head>
	<body>
		<div id="app">
			<input type="text" v-model="name1" />+
			<input type="text" v-model="name2" />=
			<input type="text" v-model="name3" />

		</div>
	</body>

	<script>
		var vm = new Vue({
			el: '#app',
			data: {
				name1: '',
				name2: '',
				name3: ''
			},
			methods: {
				
			},
			watch:{
				//监视data数据的变化，然后触发这个watch中对应的function处理函数
				'name1':function(newVal,oldVal){
					// console.log("sss")
					// this.name3=this.name1+ '---'+this.name2
					console.log(newVal+'----'+oldVal)
					this.name3 = newVal + '---' + this.name2
				},
				'name2':function(newVal){
					
					this.name3 = this.name1 + '---' + newVal
				}
			}
		})
	</script>
</html>
